import {
  Engine,
  Scene,
  Color3,
  PhotoDome,
  ArcRotateCamera,
  Vector3,
  Mesh,
  StandardMaterial,
  PointerEventTypes
} from '@babylonjs/core'
import { Line } from '@babylonjs/gui'
import '@babylonjs/loaders'
// import '@babylonjs/inspector'

// import nav from './nav'
// import createUI from './ui'

import Loader from './loader'
import TagUI from './ui'

import createServer from './server'

const canvas = document.getElementById('app')
const engine = new Engine(canvas as HTMLCanvasElement)

// const uri = 'shiyan.gltf'
// const uri = '中鼎工程文件.gltf'
// const uri = 'https://app-files.vanoda.net/shiyan.gltf'
// const uri = 'assets/living-room-blender.glb'
// const uri = 'test/babyfiles/living_room.babylon'
// const uri = 'test/untitled.gltf'
// const uri = 'test/untitled-c.glb'

const getAxis = (...args) => {
  const b = 60
  const arr = args.map((x) => x * b)
  return new Vector3(...arr)
}

const createScene = async () => {
  const scene = new Scene(engine)
  // const loader = new Loader(scene)

  // const container = await loader.use(uri)
  // container.addAllToScene()
  // // const camera = scene.getNodeByName('客厅')
  // // scene.activeCamera =
  // scene.createDefaultCameraOrLight(true)
  // scene.activeCamera.attachControl(canvas, true)

  const demo = new PhotoDome(
    'testdome',
    'assets/room3.jpg',
    {
      resolution: 32,
      size: 1000
    },
    scene
  )
  demo.imageMode = PhotoDome.MODE_MONOSCOPIC

  const camera = new ArcRotateCamera(
    'Camera',
    -Math.PI / 2,
    Math.PI / 2,
    5,
    Vector3.Zero(),
    scene
  )
  camera.attachControl(canvas, true)
  camera.inputs.attached.mousewheel.detachControl()

  // scene.createDefaultCameraOrLight(true)
  // const camera = scene.activeCamera
  // camera.

  // 沙发

  console.log(scene)

  // 飘窗小桌
  // const zuozi = Mesh.CreateSphere('zuozi', 32, 5, scene)
  // zuozi.position = new Vector3(-300, -300, -350)

  // zuozi.material = mate

  // const ui = new TagUI()
  // ui.addTag(shafa, () => {
  //   alert('点击了标签' + shafa.name)
  // })

  // ui.addTag(zuozi, () => {
  //   alert('点击了标签' + zuozi.name)
  // })

  // ui.createAxis(scene)

  const fps = document.getElementById('fps')
  engine.runRenderLoop(function () {
    scene.render()
    fps.innerHTML = engine.getFps().toFixed() + ' fps'
  })

  scene.onPointerObservable.add((pointerInfo) => {
    const { type, pickInfo } = pointerInfo
    // if (pickInfo && pickInfo.pickedMesh && pickInfo.pickedMesh.)
    if (pointerInfo.type === PointerEventTypes.POINTERTAP) {
      console.log(pointerInfo)
      const shafa = Mesh.CreateSphere('shafa', 32, 5, scene)
      const mate = new StandardMaterial('mate', scene)
      mate.emissiveColor = new Color3(1, 1, 1)
      shafa.material = mate

      const { _x, _y, _z } = pointerInfo.pickInfo.pickedPoint
      shafa.position = new Vector3(_x, _y, _z)
    }
  })

  return scene
}

createScene()
// const ui = new TagUI()

// const init = (canvas) => {
//   const loader = new Loader(scene)
//   loader.use(uri).then((container) => {
//     container.addAllToScene()
//     scene.createDefaultLight(true)
//     scene.activeCamera = loader.camera
//     scene.activeCamera.attachControl(canvas, true)

//     // scene.debugLayer.show()

//     console.log(scene)

//     // const board = scene.meshes.find((m) => m.name === '立方体.5')
//     // ui.addTag(board, () => {
//     //   alert('点击了标签' + board.name)
//     // })

//     // scene.createDefaultCameraOrLight(true)
//     // const camera = <ArcRotateCamera>scene.activeCamera
//     // camera.attachControl(canvas, false)
//     // scene.collisionsEnabled = true
//     // camera.checkCollisions = true
//     // camera.radius = 1
//     // camera.upperRadiusLimit = 1.5

//     const fps = document.getElementById('fps')
//     engine.runRenderLoop(function () {
//       scene.render()
//       fps.innerHTML = engine.getFps().toFixed() + ' fps'
//     })
//   })
// }

// init(canvas)

window.addEventListener('resize', function () {
  engine.resize()
})
